<template>
  <div>
    <div>
      <el-table
        :data="tableData"
        style="width: 100%">
        <el-table-column label="操作" width="100">
          <template slot-scope="scope">
            <el-button
              @click="handleupdate(scope.$index, scope.row)"
              class="el-icon-tickets" circle v-if="scope.row.applystatus==1||scope.row.applystatus==3"
              style="background-color: gainsboro"></el-button>
            <el-button
              @click="handleupdate(scope.$index, scope.row)"
              class="el-icon-tickets" circle v-if="scope.row.applystatus==2" disabled></el-button>
          </template>
        </el-table-column>
        <el-table-column
          prop="name"
          label="客户名称"
          width="180">
        </el-table-column>
        <el-table-column
          prop="creditcode"
          label="统一信用代码"
          width="280">
        </el-table-column>
        <el-table-column
          prop="name"
          label="企业名称"
          width="180">
        </el-table-column>
        <el-table-column
          label="友商类型"
          width="130">
          <template slot-scope="scope">
            <span v-if="scope.row.friendtype==1">客户</span>
            <span v-if="scope.row.friendtype==2">友商</span>
          </template>
        </el-table-column>
        <el-table-column
          prop="applystatus"
          label="申请状态"
          width="130">
          <template slot-scope="scope">
            <span v-if="scope.row.applystatus==1">待关注</span>
            <span v-if="scope.row.applystatus==2">关注</span>
            <span v-if="scope.row.applystatus==3">取消</span>
          </template>
        </el-table-column>
        <el-table-column
          prop="applytime"
          label="申请日期日期"
          width="180">
        </el-table-column>
      </el-table>
    </div>
    <div style="margin-left: 850px">
      <el-pagination
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        background
        :current-page="1"
        :page-sizes="[10,15,20]"
        :page-size="10"
        layout="total, sizes, prev, pager, next, jumper"
        :total=pageinfo.total>
      </el-pagination>
    </div>
  </div>
</template>

<script>
export default {
  name: "mefocus",
  props:["mepageinfo"],
  data() {
    return {
      tableData: [],
      pageinfo: {},
      pn: 1,
      page: 10
    };
  },
  methods: {
    handleSizeChange(val) {
      this.page=val;
    },
    handleCurrentChange(val) {
      this.pn=val;
    },
    handleshow() {

    },
    handleupdate(index,row) {
      var s = JSON.stringify(row);
      var parse = JSON.parse(s);
      parse.applystatus=2;
      this.axios.post(this.baseUrl + "mefocus/update",parse)
        .then(res => {
          row.applystatus=2;
          this.$message({
            type: 'success',
            message: '操作成功'
          });
        })
        .catch(error => {
          this.$message({
            type: 'warning',
            message: '关注失败'
          });
        })
    },
    handledelete() {

    },
    start() {
      this.axios.get(this.baseUrl + "mefocus/findAll/" + this.pn + "/" + this.page)
        .then(res => {
          this.tableData = res.data.data.list
          this.pageinfo = res.data.data
        })
    }

  },
  created() {
    this.start()
  },
  watch:{
    mepageinfo:{
      handler(newValue, oldValue) {
        this.pageinfo = newValue.mepageinfo;
        this.tableData=newValue.mepageinfo.list
        console.log(newValue)
      },
      deep: true
    }
  }

}
</script>

<style scoped>

</style>
